<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8"> 
	<title><?=$this->lang->line('site_title');?></title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>	
	<meta http-equiv="cache-control" content="max-age=0" />
	<meta http-equiv="cache-control" content="no-cache" />
	<meta http-equiv="expires" content="0" />
	<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
	<meta http-equiv="pragma" content="no-cache" />
	<!-- Collaborative custom styles -->
	<link href="<?=base_url()?>assets/css/style.css" rel="stylesheet" type="text/css" />
	
    <!-- Le styles -->
    <link href="<?=bootstrap_assets()?>css/bootstrap.css" rel="stylesheet">
    <link href="<?=bootstrap_assets()?>css/bootstrap-responsive.css" rel="stylesheet">
    <link href="<?=bootstrap_assets()?>css/docs.css" rel="stylesheet">
    <link href="<?=bootstrap_assets()?>js/google-code-prettify/prettify.css" rel="stylesheet">
	

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="assets/js/html5shiv.js"></script>
    <![endif]-->
	

    <!-- Le fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
    <link rel="shortcut icon" href="assets/ico/favicon.png">
	
	<script src="<?=base_url()?>assets/js/libs/jquery-1.8.1.min.js"></script> 
	<!-- Firman : Add variable for nice scroll -->
	<script>var App = {test:true} </script>
	<script src="<?=base_url()?>assets/js/libs/jquery.nicescroll.min.js"></script> 
	<script src="<?=base_url()?>assets/js/libs/jquery-idleTimeout.js"></script> <script src="<?=bootstrap_assets()?>js/bootstrap.min.js"></script> 
	
	
	<style type="text/css">
		body{
			background-color:#60a4ff;
			padding:0px;
			margin:0px auto;
		}
		h3{
			color:#ffffff;
			margin-top:5px;
		}
		.body_container{
			width:60%;
			margin:0px auto;
			border:3px dashed #ffee00;
			border-radius: 10px 10px 10px 10px;
			padding:10px;
		}
		select{
			background-color:#fdffdb;
			height:50px;
			font-size:24px;
		}
		button{
			height:60px;
			margin-left:0px;
			width:100%;
		}
	</style>
	<script type="text/javascript" charset="utf-8">
	    function onnload(){ 
			if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){ // MSIE x.x; 
				var ieversion=new Number(RegExp.$1);
				if(ieversion<9){
					alert("<?=$this->lang->line('compatible_ie');?>"); 
					window.location.href = baseurl + "auth/logout";  
				}
			}
		}
		 window.onload = onnload; 
	</script>
  </head>
<body>
<script type="text/javascript" charset="utf-8">
	var baseurl = "<?=base_url()?>"; 
	var file_json = '<?=$json?>';
	var onlineCheckInterval;
	$(document).ready(function() {
	$("#file_list").niceScroll();
		var liveTimeout, confTimeout, sessionTimeout;
		file_json = JSON.parse(file_json);
		onlineCheckInterval = setInterval(function(){
					var url = baseurl+"CommHub/online_check"; 
						var request=$.ajax({
							type: 'POST',
							url: url 
						});
						request.done(function(msg) {
							if(!msg){
								clearInterval(onlineCheckInterval);
								setTimeout(function(){
										window.location = baseurl+"home/";
								}, 1000);
								
							}
						});
			},5000);
		$(document).bind('click', function()
		{ 
		  // clearTimeout(liveTimeout); 
		  // liveTimeout = setTimeout(function(){
									// var url = baseurl+"CommHub/delete_session"; 
									// var request=$.ajax({
										// type: 'POST',
										// url: url 
									// });
									// request.done(function(msg) {
										
										// alert("Session has Expired !");
										// setTimeout(function(){
											// window.location.href = baseurl;
										// }, 2000); 
									// });
								// }, 1000*3600*24);
		   
		});
		$('#group_select').change(function() {
			var selectedGroupId = $('#group_select').val();
			var newOption="";
			for(var i=0;i<file_json.length;i++)
			{
				if(file_json[i].group_id == parseInt(selectedGroupId) ||  parseInt(selectedGroupId) ==0)
					// newOption+="<option value="+file_json[i].file_id+">"+file_json[i].file_name+"</option>"
					newOption += '<div class="media file-list-item" style="cursor:pointer;margin-left:5px;margin-right:5px;" file_id="'+file_json[i].file_id+'">'+
								'	<a  class="pull-left">'+
									'  <img  class="media-object" alt="thumbnail" style="width: 64px; height: 64px;" src="<?=base_url()?>/documents/'+file_json[i].file_id+'/thumb-1.png">'+
								'	</a>'+
								'	<div class="media-body">'+
								'	  <h4 class="media-heading">'+file_json[i].file_name+'</h4>'+
								'<?=$this->lang->line('group_name_caption');?> : '+file_json[i].group+
								'<br><?=$this->lang->line('page_count_caption');?> : '+file_json[i].page_count+
								'<br><?=$this->lang->line('created_time_caption');?> : '+file_json[i].created_on+
								'<br><?=$this->lang->line('last_update_caption');?> : '+file_json[i].last_update+
								'	</div>'+
								 ' </div>'
			}
			$('#file_list').empty().append(newOption);
			$(".media").on('click',function(e){
			  var r=confirm("<?=$this->lang->line('file_select_confirm');?>");
			  if (r==true)
			  {
				window.location = "<?=base_url()?>home/draw?f_id="+$(this).attr('file_id');
			  }
				
			});
		});	
		$('#group_select').trigger('change');		
	});
     
</script>
	<div class="row bg-light-gray">
	
	<div class="cloud" style="min-height:100px;top:0px;">
		<div class="container">
			<h1 class="inline-block span6"><?=$this->lang->line('value_welcome');?> <?=$username?></h1>
		</div>
	</div>
	
	
</div>
	<br>
	<div class="body_container">
		<div class="row-fluid">
			<div class="span12">
				<div class="row-fluid">
					<div class="span12"> 
						<div class="title">
							<h3><?=$this->lang->line('select_a_file');?></h3>
						</div>
					</div>
					<div class="span11">
						<div class="row-fluid">
							<div id="file_list" style="padding:10px;height:250px;overflow-y:scroll;background-color:black;color:white ;">
							  <?foreach($files_object as $file_object){?>
								<div class="media" style="margin-left:5px;margin-right:5px;">
									<a href="#" class="pull-left">
									  <img  class="media-object" alt="thumbnail" style="width: 64px; height: 64px;" src="<?=base_url()?>documents/<?=$file_object->file_id?>/thumb-1.png">
									</a>
									<div class="media-body">
									  <h4 class="media-heading"><?=$file_object->file_name?></h4>
									</div>
								  </div>
								  
							  <?}?>
							</div>
						<div class="clearfix"></div>
						 <select name="file" id="group_select"  class="btn-block" size="1">
								<?=$groups;?>
								
							</select> 
							
						
						</div>
						<!-- Nanda - Notes: Add style for color button logout in IE 9 -->
						<a href="<?=base_url()?>auth/logout" style="text-decoration:none;width:100%;" class="right"><input class="btn btn-danger" type="button" name="logout" style="height:60px;width:100%;font-size:24px;font-weight:bold;margin-top:10px; background-color:#BD362F;background-image:linear-gradient(to bottom, #EE5F5B, #BD362F);background-repeat:repeat-x;color:#FFFFFF;text-shadow:0 -1px 0 rgba(0, 0, 0, 0.25);" value="<?=$this->lang->line('value_logout');?>"></input></a>
					</div>
					
				</div>
			</div>
		</div>
	</div>
</body>
</html>